<template>
	<view class="body p40">
		<view class="card bg-white br20 d-f d-c p80">
			<view class="d-c-c">
				<u-icon name="checkmark-circle-fill" size="60" color="#4cc9f0"></u-icon>
			</view>
			<view class="f40 blue2 fb tc">报名支付成功</view>
			<view class="gray9 f28 mt40 tc">请尽快完成支付</view>
			<view class="mt80">
				<view class="item line pt20 pb20 ww100">
					<view class="blue2 fb f28">报名编号</view>
					<view class="f28 mt5">{{ detail.id }}</view>
				</view>
				<view class="item line pt20 pb20 ww100">
					<view class="blue2 fb f28">员工信息</view>
					<view class="f28 mt5">{{ detail.parentName }}|{{ detail.phone }}</view>
				</view>
				<view class="item line pt20 pb20 ww100">
					<view class="blue2 fb f28">报名子女</view>
					<view class="f28 mt5">{{ detail.studentName }}（{{ detail.age }}岁）</view>
				</view>
				<view class="item line pt20 pb20 ww100">
					<view class="blue2 fb f28">课程信息</view>
					<view class="f28 mt5">{{ detail.courseName }}（{{ detail.quantity }}天）</view>
				</view>
				<view class="item line pt20 pb20 ww100">
					<view class="blue2 fb f28">应付金额</view>
					<view class="f28 mt5">￥{{ detail.totalPrice }}</view>
				</view>
				<view class="mt50">
					<u-button @click="jump('/pages/index/index')" text="返回首页" icon="home" iconColor="#fff" color="#4361ee"></u-button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			detail: {}
		};
	},
	methods: {
		async getDetail(orderId) {
			const res = await this.$request({
				url: this.$api.getDetails,
				data: { orderId }
			});
			this.detail = res;
		}
	},
	onLoad({ orderId }) {
		this.getDetail(orderId);
	}
};
</script>

<style></style>
